<% layout('/layouts/default.html', {title: '角色管理', libs: ['validate', 'zTree']}){ %>
<div class="card bd-0">
    <div class="card-header d-flex align-items-start justify-content-between box-header fixed">
        <div class="pt-1">${role.isNewRecord ? '新增角色' : op == 'auth' ? '角色授权功能菜单' : '编辑角色'}</div>
        <div class="d-flex">

        </div>
    </div>
    <#form:form id="inputForm" model="${role}" action="${ctx}/sys/role/save" method="post">
    	<#form:hidden name="op" value="${op}"/>
        <div class="card-body card-content-fixed pd-sm-t-30 pd-sm-b-40 pd-sm-x-30">
            <div class="form-row">
                <div class="form-group col-md-6">
                    <label for="parentCode">角色名称</label>
                    <#form:hidden name="oldRoleName" value="${role.roleName}"/>
					<#form:input path="roleName" maxlength="100" readonly="${op=='auth'}" class="form-control required "
						remote="${ctx}/sys/role/checkRoleName?oldRoleName=${role.roleName}"
						data-msg-remote="角色名称已存在"/>
                </div>
                <div class="form-group col-md-6">
                    <label for="menuType">角色编码</label>
	                <#form:hidden path="isNewRecord"/>
					<#form:input path="roleCode" maxlength="64" readonly="${!role.isNewRecord}" class="form-control required abc"/>
                </div>
            </div>
            <% if(op == 'add' || op == 'edit') {%>
            <div class="form-row">
	            <div class="form-group  col-md-6">
	                <label>排序号</label>
	                <#form:input path="roleSort" maxlength="10" class="form-control required digits"/>
	            </div>
	            <div class="form-group  col-md-6">
	                <label>用户类型</label>
	                <#form:select path="userType" dictType="sys_user_type" class="form-control select2 required"/>
	            </div>
            </div>
            <div class="form-group">
                <label>备注</label>
                 <#form:textarea path="remarks" class="form-control" row="5" placeholder="请输入" />
            </div>
            <% } %>
            <% if(op == 'add' || op == 'auth') {%>
            <div class="form-unit">授权功能菜单</div>
			<div id="menus" class="ztree"></div>
			<#form:hidden name="menuCodes"/>
			<% } %>
        </div>
        <div class="card-footer pd-sm-l-30">
            <div class="row">
                <div class="col-sm-offset-2 col-sm-10">
                	<% if(expIf("hasAuthority('sys:role:edit')")){ %>
                    <button type="submit" class="btn btn-sm btn-primary">保存提交</button>
                    <% } %>
                    <button type="button" class="btn btn-sm btn-default" onclick="js.closeCurrentTabPage()">关闭窗口</button>
                </div>
            </div>
        </div>
    </#form:form>
</div>
<% } %>
<script>
$("#inputForm").validate({
	submitHandler: function(form){
		<% if(op == 'add' || op == 'auth') {%>
		// 获取数据权限数据
		var menuData = [];
		var treeNodes = menuTree.getCheckedNodes(true);
		for(var i=0; i<treeNodes.length; i++) {
			menuData.push(treeNodes[i].id);
		}
		$("#menuCodes").val(menuData.join(','));
		<% } %>
		// 提交表单数据
		js.ajaxSubmitForm($(form), function(data){
			js.showMessage(data.message);
			if(data.result == Global.TRUE){
				js.closeCurrentTabPage(function(contentWindow){
					contentWindow.page();
				});
			}
		}, "json");
    }
});
<% if(op == 'add' || op == 'auth') {%>
//加载数据权限树结构
var setting = {
	check:{enable:true,nocheckInherit:true,chkboxType:{"Y":"ps","N":"ps"}},
	view:{selectedMulti:false,nameIsHTML: true},
	data:{simpleData:{enable:true},key:{title:"title"}},
	callback:{
		beforeClick: function (treeId, treeNode, clickFlag) {
			var tree = $.fn.zTree.getZTreeObj(treeId);
			tree.checkNode(treeNode, !treeNode.checked, true, true);
			return false;
		},
		onCheck: function (event, treeId, treeNode){
			var tid = treeNode.tId;
			if(!treeNode.checked){
				$(".checkall[value="+treeId+"]").each(function(){
					if(this.checked){
					    $(this).removeAttr("checked").iCheck('update');
					}
					return false;
				}); 
			}
		}
	}
},
sysCodeDict = ${@DictUtils.getDictListJson('sys_menu_sys_code')},
menuTree = {}; // 用sysCode分类存储所有菜单树
$.ajax({
	type: 'POST',
	url: "${ctx}/sys/role/menuTreeData?___t=" + new Date().getTime(),
	data: {roleCode: '${role.roleCode}'},
	dataType: 'json',
	async: false,
	error: function(data){
		js.showErrorMessage(data.responseText);
	},
	success: function(data, status, xhr){
		// 初始化树结构
		var tree = $.fn.zTree.init($("#menus"), setting, data.menuList);
		// 展开第一级节点
		var nodes = tree.getNodesByParam("level", 0);
		for(var i=0; i<nodes.length; i++) {
			tree.expandNode(nodes[i], true, false, false);
		}
		// 展开第二级节点
		//nodes = tree.getNodesByParam("level", 1);
		//for(var i=0; i<nodes.length; i++) {
		//	tree.expandNode(nodes[i], true, false, false);
		//}
		// 默认展开全部节点
		//tree.expandAll(true);
		// 树结构：全选、取消全选
		//$('#checkall_'+sysCode).iCheck({
        //	checkboxClass:'icheckbox_minimal-grey'
			//}).on('ifChecked ifUnchecked', function(){
		//	var sysCode = $(this).attr('sysCode');
		//	if(this.checked){
		//		menuTrees[sysCode].checkAllNodes(true);
		//	}else{
		//		menuTrees[sysCode].checkAllNodes(false);
		//	}
		//}).attr("sysCode", sysCode);
		// 展开和折叠按钮绑定
		//$('#expand_'+sysCode).click(function(){
		//	var sysCode = $(this).attr('sysCode');
		//	menuTrees[sysCode].expandAll(true);
		//}).attr("sysCode", sysCode);
		//$('#collapse_'+sysCode).click(function(){
		//	var sysCode = $(this).attr('sysCode');
		//	menuTrees[sysCode].expandAll(false);
		//}).attr("sysCode", sysCode);
		// 将树对象存储到全局数组里
		menuTree = tree;
	//}
	// 默认选择节点
	var roleMenuCodes = data.roleMenuCodes;
	for(var i=0; i<roleMenuCodes.length; i++) {
		var node = tree.getNodeByParam("id", roleMenuCodes[i]);
		try{tree.checkNode(node, true, false);}catch(e){}
	}
	}
});
<% } %>
</script>
</body></html>